<!--<mat-toolbar mat-dialog-title class="mat-dialog-title" [color]="['primary']">
  <span>Browse for data</span>
  <span fxFlex></span>
  <button mat-icon-button (click)="cancel()">
    <mat-icon arial-label="Close dialog">close</mat-icon>
  </button>
</mat-toolbar>
-->
<mat-dialog-content fxFlex="100%">
<dataset-preview-stepper #datasetStepper [additionalSteps]="data.additionalSteps" (previewSaved)="onSaved($event)" (previewCanceled)="cancel()" [allowMultiSelection]="data.allowMultiSelection" [saveLabel]="data.saveLabel"></dataset-preview-stepper>
</mat-dialog-content>
<mat-dialog-actions>
  <!-- Action buttons -->
  <mat-divider></mat-divider>
  <div fxLayout="row" fxFlex>
    <button mat-button (click)="cancel()">Cancel</button>
    <span fxFlex></span>
    <button mat-button (click)="onBack()" *ngIf="showBack()">Back</button>
    <div fxLayout="column" *ngIf="showNext()">
      <button mat-raised-button (click)="onNext()" color="primary" *ngIf="showNext()" [disabled]="nextDisabled()">Next</button>
      <button mat-raised-button (click)="onSave()" [hidden]="!showSave()" [disabled]="saveDisabled()">{{saveLabel}}</button>
       <!-- <span [hidden]="!nextDisabled()" class="warn">A selection is required</span> -->
    </div>
    <div [hidden]="!showSave()">
      <td-notification-count [notifications]="getDataSetsLength()">
      <button mat-raised-button color="primary" (click)="onSave()" [disabled]="saveDisabled()">Add</button>
      </td-notification-count>
    </div>
  </div>

</mat-dialog-actions>

